<template>
	<view class="load" v-if="!load">
		<u-loading-icon mode="circle" inactive-color="#fff" text="正在加载..." vertical></u-loading-icon>
	</view>
	<view v-else class="wrap" :style="'background-image: url(' + imglist[0] + ');'">
		<view class="overlay"></view>
		<view class="contentbox">
			<view class="topbox">
				<image class="logoimg" :src="imglist[0]" mode="aspectFill">
					<view class="statitle" v-if="resData.StatusTips">{{resData.StatusTips?resData.StatusTips:'报名中'}}</view>
				</image>
				<view class="rightbox">
					<view>
						<view class="title">
							{{ $util.entitiesToUtf16(resData.Title) }}
						</view>
						<view class="PlaceTypebox">
							<view class="PlaceType" v-for="(item,index) in resData.PlaceType.split(',')" :key="index">{{item}}</view>
						</view>
						
					</view>
					<view>
						<view class="price">{{ resData.RegisterFee == 0 ? '免费' : '￥' + resData.RegisterFee }}</view>
						<view class="cklibox">
							<view class="ClickNum">
								{{ '浏览 ' + (resData.ClickNum ? temaBrowserNum : resData.ClickNum) }}
							</view>
							<!-- <view class="StatusTips" >{{resData.StatusTips?resData.StatusTips:'未开始'}}</view> -->
						</view>
						
					</view>


				</view>
			</view>
			<view class="navbox">
				<view v-for="(item, index) in navList" :key="index" class="navtext"
					:class="{ 'text5': navIndex == index }" @click="navswict(index)">
					<block v-if="index != 1">
						{{ item }}
					</block>
					<block v-if="index == 1">
						{{ item + ' ' + applyNum + '/' + (resData.PeopleNum+1) }}
					</block>
					<view v-if="navIndex == index" class="boline"></view>
				</view>
				<!-- <image src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722582666387771.png" class="reportimg"></image> -->
			</view>
			<block v-if="navIndex == 0">
				<view class="contbox_1">
					<view class="timebox">
						<image class="timeimg"
							src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/17225826816151324.png"></image>
						<view class="timetext">{{ '开始时间：' + getTime2(resData.ServerDate) + ' '+getWeek(resData.ServerDate)+' '+(resData.ServerTime?resData.ServerTime : '')}}</view>
					</view>
					<view class="timebox" v-if="resData.IsEnd == 1">
						<image class="timeimg"
							src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/17225826816151324.png"></image>
						<view class="timetext">{{ '结束时间：' + getTime2(resData.EndDate) + ' '+getWeek(resData.EndDate)+' '+(resData.ServerEndTime?resData.ServerEndTime : '')}}</view>
					</view>
					<view class="addrebox" @click="openMap">
						<image class="addreimg"
							src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722582696202632.png"></image>
						<view class="addretext">{{ '活动地址：' + resData.Place }}</view>
						<image class="mapimg"
							src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/172258272334584.png"></image>
					</view>
				</view>
				<view class="conbox_2" @click="openPopupTip">
					<image class="noticeimg"
						src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722583017106830.png"></image>
					<view class="noticetext">{{ '退款政策/入场方式说明/候场说明' }}</view>
					<image class="arrow"
						src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/17225830365271053.png"></image>
				</view>
				<view class="conbox_3">
					<view class="title_3">{{ '-活动详情 -' }}</view>
					<view class="debox">
						<view class="Remark">
							{{ $util.entitiesToUtf16(resData.Remark) }}
						</view>
						<image class="deimg" v-for="(item, index) in imglist" :key="index" :src="item" mode="widthFix" @click="lookimg(imglist,index)">
						</image>
					</view>
				</view>
				<!-- <view class="conbox_4">
					<view class="title_4">{{'- 猜你喜欢 -'}}</view>
					<view></view>
				</view> -->
			</block>
			<block v-if="navIndex == 1">
				<view class="pelbox">
					<view class="hdbox" v-for="(item, index) in applyList" :key="index">
						<view class="isComing" style="background: #FF581D;" v-if="index == 0">圈主</view>
						<view class="isComing" v-if="item.Status == 2">到场</view>
						<image class="pelimg" :src="item.HeadImgUrl"
							@click="nav_to('/pages/user/user_visitor?id=' + item.UserID)" mode="aspectFill"></image>
						<view class="nametext hiddenText">{{ item.Name }}</view>
					</view>

					<!-- <view class="allpel" @click="nav_to('')">
						<view class="addtext">查看</view>
						<view class="addtext">全部</view>
					</view> -->
				</view>
				<view class="system">
					<image class="xing" src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1723518221707418.png"></image>
					<view class="systemtext">{{ '系统通知：活动时间为' + getTime2(resData.ServerDate) + ' '+getWeek(resData.ServerDate)+resData.ServerTime}}</view>
				</view>
				<view class="hint">{{ '[温馨提示]：若出现争议或纠纷，为了更好的保障您的合法权益，挥友圈只视取平台内的聊天记录为有效证据。' }}</view>
			</block>
			<block v-if="navIndex == 2">
				<block v-if="!is_sign">
					<view class="suobox">
					<image class="suoimg" src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1726041379869754.png"></image>
					<view class="suotitle">非活动成员无法查看留言</view>
					<view class="suotitle">快加入一起畅聊吧</view>
					</view>
				</block>
				<block v-else>
				<scroll-view :scroll-y="true" class="scroll-Y" :scroll-top="scrollTopmse" :scroll-with-animation="true" >
					<view class="load" v-if="!mseload">
					<u-loading-icon mode="circle" inactive-color="#fff" text="正在加载..." vertical></u-loading-icon>
					</view>
					<view class="mesbox" :style="{opacity:mseload?'1':'0'}">
						<view id="mesview" class="mescont">
						<view v-for="(item,index) in mseList" :key="index">
							<view class="mestime">{{mindif(index)}}</view>
							<!-- 其他人的消息 -->
							<view class="other" v-if="item.UserID != user.UserID">
								<image class="otherhdimg" :src="item.HeadImgUrl" mode="aspectFill" @click="nav_to('/pages/user/user_visitor?id='+item.UserID)"></image>
								<view class="otinfo">
								<view class="otnamebox">
								<view class="ottype" v-if="initUser.UserID == item.UserID">圈主</view>
								<view class="otname">{{item.Name?$util.entitiesToUtf16(item.Name):''}}</view>
								
								</view>
								<view class="otmes">{{item.Content?$util.entitiesToUtf16(item.Content):''}}</view>
								</view>
							</view>
							<!-- 自己的消息 -->
							<view class="my" v-else>
								<view class="myinfo">
								<view class="mynamebox">
									<view class="myname">
										{{item.Name?$util.entitiesToUtf16(item.Name):''}}
									</view>
									<view class="mytype" v-if="initUser.UserID == item.UserID">圈主</view>
								</view>
								<view class="mycon">
									<image class="mydel" src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1725417858156805.png" @click="msedel(item.ID,index)"></image>
									<view class="mymes">{{item.Content?$util.entitiesToUtf16(item.Content):''}}</view>
								</view>
								</view>
								<image class="myhdimg" :src="item.HeadImgUrl" mode="aspectFill" @click="nav_to('/pages/user/user_visitor?id='+item.UserID)"></image>
							</view>
						</view>
						</view>
					</view>
				</scroll-view>
				</block>
			</block>
			<view class="noWorkBox"></view>
		</view>
		<view v-if="navIndex == 2 && is_sign" class="input-box" :style="'bottom:'+keyheight+'px;'">
			<textarea ref="input" :style="isiP?'padding-top: 0rpx;height: 80rpx;line-height: 80rpx;':''" class="marginBottom" cursor-spacing="30"   confirm-type="发送" :show-confirm-bar="false" maxlength="200" :value="mes" placeholder-class="placClass" placeholder="说点什么吧" @blur="onBlur" @input="oninput" @focus="mesfo" :focus="focus"></textarea>
			<view class="view-btn" @click="send">
				发送
			</view>
		</view>
		<view class="bottombox" :class="ismodel14 ? 'heightadd' : ''" v-if="navIndex != 2">
			<view class="bottom" :class="ismodel14 ? 'heightadd' : ''">
				<!-- 是发起人 -->
				<block v-if="initUser.UserID == user.UserID">
					<block v-if="resData.Status != -1">
						<view class="btnGroup">
							<!--  #ifdef MP-WEIXIN -->
							<block v-if="resData.Status != -99">
							<view class="halfBtn organize" @click="reduce_user()">扫码核销</view>
							<button class="halfBtn blackBtn" hover-class="none" open-type="share" >
								<view class="bcolor">邀请好友</view>
							</button>
							</block>
							<block v-else>
								<view class="fullBtn organizeapp">审核中</view>
							</block>
							<!-- #endif -->
							<!--  #ifdef APP-PLUS -->
							<view class="halfBtn organizeapp" @click="reduce_user()">扫码核销</view>
							<!-- #endif -->
						</view>
					</block>
					<block v-else>
						<view class="btnGroup">
							<view class="money">
								<!-- <block v-if="resData.AppointmentType !='一起挥'"> -->
								<view class="titl1" v-if="resData.ServerPrice[pricebg].IsPromotion == 1">
									<text class="Promotion">{{ resData.ServerPrice[pricebg].Score }} </text>
									<text class="prtitle">挥豆</text>
									<text class="Price">{{ resData.ServerPrice[pricebg].Score }}<text
											class="ptitle">挥豆</text></text>

								</view>
								<view v-else class="titl1">{{ resData.ServerPrice[pricebg].Score + '挥豆' }}</view>
								<!-- </block> -->
								<!-- <block v-else>
									<view  class="titl1">{{ resData.ServerPrice[pricebg].Score + '挥豆' }}</view>
								</block> -->

								<view class="titl2">剩余:{{ Score + '挥豆' }}</view>
							</view>
							<view class="ebtn" @click="payment">
								<view>发布上热门</view>
								<!-- <image src="" mode=""></image> -->
							</view>
						</view>
					</block>
				</block>
				<block v-else>
					<block v-if="!is_sign">
						<block v-if="IsInvitor">
							<view class="btnGroup">
								<view class="halfBtn whiteBtn" @click="reject_invite">拒绝</view>
								<view class="halfBtn blackBtn" @click="agree_invite">同意</view>
							</view>
						</block>
						<view class="subscribe" v-else-if="resData.Status == -99">
							<view class="fullBtn whiteBtn">审核中</view>
						</view>
						<!-- <view class="subscribe" v-else-if="resData.Status == 1 || resData.Status == 3"> -->
							<view class="subscribe" v-else-if="resData.Status == 3"> 
							<!--  #ifdef APP-PLUS -->
							<!-- <button hover-class="none" @click="app_share">
									<image :src="ossPath + `/upload/17113498953551161.png`" mode="widthFix"></image>
								</button> -->
							<!-- #endif -->
							<view class="fullBtn whiteBtn">已结束</view>
							<!--  #ifdef MP-WEIXIN -->
							<view class="shareBtn">
								<button hover-class="none" @click="$refs.shareWX.open()">
									<image
										src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722586426749477.png"
										mode="widthFix"></image>
								</button>
								<view class="sharetetx">分享</view>
							</view>
							<!-- #endif -->
						</view>

						<view class="subscribe" v-else>
							<!--  #ifdef APP-PLUS -->
							<!-- <button hover-class="none" @click="app_share">
									<image :src="ossPath + `/upload/17113498953551161.png`" mode="widthFix"></image>
								</button> -->
							<!-- #endif -->

							<view @click="subJoin" class="fullBtn blackBtn">
								立即报名
							</view>
							<!--  #ifdef MP-WEIXIN -->
							<view class="shareBtn">
								<button hover-class="none" @click="$refs.shareWX.open()">
									<image
										src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722586426749477.png"
										mode="widthFix"></image>
								</button>
								<view class="sharetetx">分享</view>
							</view>
							<!-- #endif -->
						</view>
					</block>
					<block v-else-if="resData.Status <= 2 && resData.Status >= 0">
						<block
							v-if="IsSuccessed && Success_Msg != '您已退出该球局' && Success_Msg != '您已拒绝该球局' && Success_Msg != '您已退出' && resData.Status != 1">
							<view class="subscribe">
								<!--  #ifdef APP-PLUS -->
								<!-- <button hover-class="none" @click="app_share">
										<image :src="ossPath + `/upload/17113498953551161.png`" mode="widthFix"></image>
									</button> -->
								<!-- #endif -->
								<view v-if="user_state[0].Status == 1"
									@click="goOrderDetail()" class="fullBtn blackBtn">
									查看票码</view>
								<!-- <view v-else-if="user_state[0].Status == 1 && resData.AppointmentType == '一起挥'"
									@click="cancelBall()" class="fullBtn kongbtn">{{ resData.AppointmentType ==
										'一起挥' ? '退出活动' : '取消报名' }}
								</view>
								<view v-else-if="user_state[0].Status == 1 && resData.AppointmentType != '一起挥'"
									class="fullBtn whiteBtn">报名成功
								</view> -->
								<!-- <view class="shareBtn" @click.stop="goOrderDetail()">
									<button>
										<image
											src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1723020043488304.png"
											mode="widthFix"></image>
									</button>
									<view class="sharetetx">票码</view>
								</view> -->
								<!--  #ifdef MP-WEIXIN -->
								<view class="shareBtn">
									<button hover-class="none" @click="$refs.shareWX.open()">
										<image
											src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722586426749477.png"
											mode="widthFix"></image>
									</button>
									<view class="sharetetx">分享</view>
								</view>
								<!-- #endif -->
							</view>
							<!-- <view @click="cancelBall()" class="fullBtn blackBtn">取消报名</view> -->
						</block>
						<block v-else-if="resData.Status == 1">
							<!--  #ifdef APP-PLUS -->
							<!-- <button hover-class="none" @click="app_share">
									<image :src="ossPath + `/upload/17113498953551161.png`" mode="widthFix"></image>
								</button> -->
							<!-- #endif -->


							<view class="fullBtn whiteBtn">正在进行中</view>
							<!--  #ifdef MP-WEIXIN -->
							<view class="shareBtn">

								<button hover-class="none" @click="$refs.shareWX.open()">
									<image
										src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722586426749477.png"
										mode="widthFix"></image>
								</button>
								<view class="sharetetx">分享</view>
							</view>
							<!-- #endif -->
						</block>
						<block v-else-if="ismyrefuse">
							<view class="fullBtn whiteBtn">很遗憾，您未被选中</view>
							<!--  #ifdef MP-WEIXIN -->
							<view class="shareBtn">

								<button hover-class="none" @click="$refs.shareWX.open()">
									<image
										src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722586426749477.png"
										mode="widthFix"></image>
								</button>
								<view class="sharetetx">分享</view>
							</view>
							<!-- #endif -->
						</block>
						<block v-else-if="user_state[0].Status == -1">
							<view class="fullBtn whiteBtn">已退出</view>
							<!--  #ifdef MP-WEIXIN -->
							<view class="shareBtn">

								<button hover-class="none" @click="$refs.shareWX.open()">
									<image
										src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722586426749477.png"
										mode="widthFix"></image>
								</button>
								<view class="sharetetx">分享</view>
							</view>
							<!-- #endif -->
						</block>
						<block v-else-if="user_state[0].Status == 2">
							<view class="fullBtn whiteBtn">已核销</view>
							<!--  #ifdef MP-WEIXIN -->
							<view class="shareBtn">

								<button hover-class="none" @click="$refs.shareWX.open()">
									<image
										src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722586426749477.png"
										mode="widthFix"></image>
								</button>
								<view class="sharetetx">分享</view>
							</view>
							<!-- #endif -->
						</block>
					</block>
					<block v-else-if="resData.Status == 3">
						<view class="subscribe">

							<!--  #ifdef APP-PLUS -->
							<!-- <button hover-class="none" @click="app_share">
										<image :src="ossPath + `/upload/17113498953551161.png`" mode="widthFix"></image>
									</button> -->
							<!-- #endif -->


							<view class="fullBtn whiteBtn">已结束</view>
							<!--  #ifdef MP-WEIXIN -->
							<view class="shareBtn">

								<button hover-class="none" @click="$refs.shareWX.open()">
									<image
										src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1722586426749477.png"
										mode="widthFix"></image>
								</button>
								<view class="sharetetx">分享</view>
							</view>
							<!-- #endif -->
						</view>
					</block>
				</block>
			</view>
		</view>


		<!-- 微信 分享 转发好友、朋友圈 -->
		<!-- #ifdef MP-WEIXIN -->
		<uni-popup ref="shareWX" type="bottom">
			<view class="x-share">
				<button hover-class="none" open-type="share" class="item" @click="$refs.shareWX.close()">
					<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/icon/wx_logo.png"
						style="margin-bottom: -8rpx;"></image>
					<span style="margin-bottom: -18rpx;font-size: 32rpx;">转发好友</span>
				</button>
				<button class="item" @click="wxSharePYQ()">
					<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/icon/pyq_logo.png"
						style="margin-bottom: -8rpx;"></image>
					<span style="margin-bottom: -18rpx;font-size: 32rpx;">分享朋友圈</span>
				</button>
			</view>

		</uni-popup>

		<uni-popup ref="shareTips">
			<view class="share_tips">
				<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/1715929661502368.png" mode="widthFix">
				</image>
				<view class="tips_close" @click="$refs.shareTips.close()">
					我知道了
				</view>
			</view>
		</uni-popup>
		<!-- #endif -->
		<!-- APP 分享 转发好友、朋友圈 -->
		<!-- #ifdef APP-PLUS -->
		<uni-popup ref="share" type="bottom">
			<view class="x-share">
				<view class="item" @click="shareWX()">
					<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/icon/wx_logo.png"></image>
					<span>转发好友</span>
				</view>
				<view class="item" @click="sharePYQ()">
					<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/icon/pyq_logo.png"></image>
					<span>分享朋友圈</span>
				</view>
			</view>

		</uni-popup>
		<!-- #endif -->

		<uni-popup ref="popupTip" type="bottom">
			<view class="tip wap">
				<view class="tit f1 fwb">
					活动须知
				</view>
				<view class="title_popu">退款政策</view>
				<view class="txt">
					<view class="mt20"><text class="f3 c2">距活动开始24小时之前，随时可退</text>
					</view>
					<view class="mt20"><text class="f3 c2">距活动开始时间不足24小时，不支持退款</text>
					</view>
					<!-- <view class="mt20"><text class="f3 c2">若保险未生效，可联系客服退款</text>
					</view> -->

				</view>
				<view class="btn mt20 mb30 btn3" @click="closePopupTip">关闭</view>
			</view>
		</uni-popup>

		<uni-popup type="center" ref="checkbox">
			<view class="Successbox">
				<image class="suimg" src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/1723017497812406.png">
				</image>
				<view class="sutext">核销成功！</view>
				<view class="coutbtn" @click="suopenclose">继续核销</view>
				<view class="suclose" @click="suclose">关闭</view>
			</view>
		</uni-popup>
		<uni-popup type="center" ref="Failcheckbox">
			<view class="Successbox">
				<image class="suimg"
					src="https://wavestation.oss-cn-shenzhen.aliyuncs.com/upload/17230184678361039.png"></image>
				<view class="sutext">核销失败</view>
				<view class="sutfiext">{{ mesAge ? mesAge : '' }}</view>
				<view class="coutbtn" @click="Fiopenclose">继续核销</view>
				<view class="suclose" @click="Ficlose">关闭</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
export default {
	data() {
		return {
            isiP:false,
			focus:false,
			phoneinfo:'',
			mseload:false,
			scrollTopmse:0,
			keyheight:0,
			mseList:[],
			mes:'',
			mesAge: '',
			navList: [
				'活动详情',
				 '当前参与',
				 '留言'
				 ],
			navIndex: 0,
			ossWatermark: '',
			isShare: 0,
			imglist: [],
			pricebg: 0,
			priceList: [],
			defaultimg: 0,
			model: '',
			ismodel14: false,
			contenttext: '', // 提示标题
			Score: '', // 挥豆余额
			toggle: true,
			ismyrefuse: false,
			ID: '',
			payPrice: 0,
			cover: '',
			user: {},
			load: false,
			resData: {},
			initUser: {},
			read: false,
			userIDList: [],
			userList: [],
			applyList: [],
			confirmList: [],
			is_sign: false, // 判断自己是否报名
			user_state: {}, //判断自己报名的状态
			list: [],
			longitude: '',
			latitude: '',
			IsInvitor: false, //是否为邀请用户
			IsSign: false,
			IsSuccessed: false,
			Success_Msg: '',
			groupID: 0,
			groupList: [],
			currentTab: 2,
			my_ball_status: 0,
			confirmNum: 0, //已确认人数
			applyNum: 0, //申请报名人数
			is_group: -1,

			is_app_share_show: false,
			ossPath: '',
			topCharactersHTML: '',
			ticketNum: 0,
			PageIndex:1,
			PageSize:10,
		};
	},
	watch: {
		confirmNum(newValue, oldValue) {
			if (newValue > oldValue) {
				this.onScrollRefresh();
			}
		},
		applyNum(newValue, oldValue) {
			if (newValue > oldValue) {
				this.onScrollRefresh();
			}
		},
	},

	onReady() {
		uni.setNavigationBarColor({
			frontColor: '#000000',
			backgroundColor: '#ffffff'
		});
	},
	async onLoad(e) {
		// this.ossWatermark = this.$ossWatermark
		this.ID = e.id;
		this.infophone()
		this.comList()
		this.ossPath = this.$ossPath;
		if (e.isShare == 1) {
			this.isShare = e.isShare
			this.init();
		}
		let _this = this
		uni.getSystemInfo({
			success: function (res) {
				console.log(res, 'system');
				_this.model = res.model
				if (_this.model.includes('iPhone') && _this.model.includes('14')) {
					_this.ismodel14 = true
				}
			}
		});

		if (await this.$store.getters.getLoginState) {
			uni.$on('join_confirm', () => {
				this.init();
			});
			uni.$on('people_confirm', () => {
				this.init();
			});

			// this.groupID = this.ID.toString();
		}

	},
	async onShow() {
		await this.init();

	},
	onUnload() {
		uni.$off('join_confirm');
		uni.$off('people_confirm');
	},
	onShareAppMessage(res) {

		//发送给朋友
		var pid = this.user.UserID;
		return {
			title: this.$util.entitiesToUtf16(this.user.Name) + '邀请您加入',
			path: '/pages/ball/ball_details?pid=' + pid + '&id=' + this.resData.ID
		};

	},
	//分享朋友圈
	onShareTimeline() {
		return {
			title: this.$util.entitiesToUtf16(this.user.Name) + '邀请您加入',
			query: "id=" + this.ID + '&isShare=1',
		};
	},
	methods: {
		infophone(){
			let _this = this
		uni.getSystemInfo({
			success: function (info) {
			_this.phoneinfo = info.model
			if(info.model.includes('iPhone')){
            	if(info.model.includes('14')){
				_this.isiP =false
				}else{
				_this.isiP =true
				}
          }
			console.log('品牌：' + info.brand);
			}
		});
		},
		mindif(index){
			if((index+1) == this.mseList.length){
				return ''
			}
			let now = this.mseList[index]
			let next = this.mseList[index+1]
			const date1 = new Date(now.CreateTime);
			const date2 = new Date(next.CreateTime);
			const millisecondsDifference = date2.getTime() - date1.getTime();
			const minutesDifference = millisecondsDifference / (1000 * 60);
			if(minutesDifference >=10){
				return this.$util.unixDatetime(this.mseList[index].CreateTime,'yy-MM')
			}
		},
		//留言列表
		async comList(){
		let res = await this.$api.post('Comment/PageList',{
			Type:'活动',
			EventID:this.ID,
			PageIndex:this.PageIndex,
			PageSize:300,
		})
		if(res.code == 0){
			if(this.PageIndex == 1){
			this.mseList = res.data.reverse()
			}else{
			this.mseList = res.data.reverse().concat(this.mseList)
			}
			
		}
		},
		//删除留言
		async msedel(id,index){
			let _this = this
			uni.showModal({
				title: "温馨提示",
				content: "您确定要删除该条留言吗？",
				confirmText: "确定",
				success: async function (res) {
				if (res.confirm) {
					let res1 = await _this.$api.post("Comment/Delete", {
					ID:id
					})
					if (res1.code == 0) {
					_this.mseList.splice(index,1)
					_this.$pv.msg("删除成功");
					} else {
					_this.$pv.msg(res1.message);
					}
				} else if (res.cancel) {
				}
				},
			});
		// let res = await this.$api.post('Comment/Delete',{
		// 	ID:id
		// })
		// if(res.code == 0){
		// 	this.mseList.splice(index,1)
		// 	this.$pv.msg("删除成功");
		// }
		},
		mesaddtop(){
		this.PageIndex++
		this.comList()
		},
		sleep (value = 30){
		return new Promise((resolve) => {
			setTimeout(() => {
			resolve()
			}, value)
		})
		},
		getRandomIntInclusive(min, max) {
			min = Math.ceil(min);
			max = Math.floor(max);
			return Math.floor(Math.random() * (max - min + 1)) + min; // 最大值也是包含的
		},
		// 滚动至聊天底部
		async scrollToBottom(wait) {
			if(!this.is_sign){
				return
			}
		if (wait) await this.sleep(wait)
		let query = uni.createSelectorQuery().in(this);
		query.select('#mesview').boundingClientRect();
		query.exec(async (res) => {
			console.log(res,'111');
			
			let hh = Math.floor(res[0].height)
			this.scrollTopmse = hh+this.getRandomIntInclusive(1,20)
			this.mseload = true
		})
		},
		async send(){
			this.focus = false
			let con = this.$util.utf16ToEntities(this.mes)
			setTimeout(()=>{
				this.focus = true
			},100)
			if(this.mes == ''){
				this.$pv.msg("请先输入内容");
				return
			}
			let res = await this.$api.post('Comment/Add',{
				Type:'活动',
				EventID:this.ID,
				Content:con
			})
			if(res.code == 0){
				this.mseList.push({
				Content:this.mes,
				CreateTime: new Date(),
				HeadImgUrl:this.user.HeadImgUrl,
				Name:this.user.Name,
				UserID:this.user.UserID,
				ID:res.data
				})
				this.scrollToBottom(50)
				this.mes = ''
				this.$pv.msg("发送成功");
			}
		},
		oninput(e){
			const { value, cursor } = e.detail
			let str = this.$util.entitiesToUtf16(value)
			if (str.length > 200) {
				this.mes = str.slice(0, 200)
			} else {
				this.mes = str
			}
		},
		mesfo(){
			if(this.phoneinfo.includes('iPhone')){
				this.keyheight = 30
			}else{
				this.keyheight = 30
			}
      		this.scrollToBottom(50)
		},
		onBlur(){
			this.keyheight = 0
		},
		Fiopenclose() {
			this.$refs['Failcheckbox'].close()
			this.reduce_user()
		},
		suopenclose() {
			this.$refs['checkbox'].close()
			this.reduce_user()
		},
		Ficlose() {
			this.$refs['Failcheckbox'].close()
		},
		suclose() {
			this.$refs['checkbox'].close()
		},
		openPopupTip() {
			this.$refs.popupTip.open();
		},
		closePopupTip() {
			this.$refs.popupTip.close();
		},
		navswict(index) {
			this.navIndex = index
			if(index == 2){
				this.PageIndex = 1
				this.focus = false
				this.scrollToBottom(1000)
				this.comList()
			}
		},
		async GetBase64ForID(id) {
			let res = await this.$api.post('Common/ConvertBase64', {
				Value_Data: this.resData.UserID
			})
			if (res.code == 0) {
				this.idBe64 = res.data
				this.ossWatermark = '?x-oss-process=image/resize,w_1080,h_1350/watermark,image_dXBsb2FkLzE3MjE0NjQ4MTI0MjcxMzQyLnBuZz94LW9zcy1wcm9jZXNzPWltYWdlL3Jlc2l6ZSxQXzEy,g_se,x_30,y_35' + '/watermark,text_5oyl5Y2h5Y-377ya' + this.idBe64 + ',size_16,color_EFEFEF,x_55,y_10';
			}
		},
		wxSharePYQ() {
			this.$refs.shareWX.close()
			this.$refs.shareTips.open()
		},
		lookimg(url, index) {
			let arr = []
			for (let i = 0; i < url.length; i++) {
				arr.push(url[i] + this.ossWatermark)

			}
			uni.previewImage({
				urls: arr,
				current: index,
				fail: function (err) {
					console.error('预览图片失败', err);
				}
			});
		},
		setprcebg(index) {
			this.pricebg = index
		},

		async GetServerPrice(title) {
			let item = title == '找私教' ? '找私教付费' : '招学员付费'
			if (title != '一起挥') {
				let res = await this.$api.post('Common/GetServerPriceList', {
					Item: item
				})
				if (res.code == 0) {
					this.priceList = res.data

				}

			}

		},
		// 检测是否可以看到电话号码
		checkPhoneType() {
			let list = this.resData.Item
			this.user.UserID
			let ishas = false
			for (let i = 0; i < list.length; i++) {
				if (list[i].Status > 0 && this.user.UserID == list[i].UserID) {
					ishas = true
				}

			}
			return ishas
		},
		//打电话
		callNumber() {
			uni.makePhoneCall({
				phoneNumber: this.resData.Phone,
				// phoneNumber: '15572847621',
				success: () => {
				},
				fail: () => {
					console.error('拨打电话失败！');
				},
			});
		},
		//支付
		async payment() {
			let sum
			if (this.resData.AppointmentType == '一起挥') {
				if (this.resData.ServerPrice[0].IsPromotion != 1) {
					sum = this.resData.ServerPrice[0].Score
				} else {
					sum = this.resData.ServerPrice[0].Promotion
				}
			} else {
				if (this.resData.ServerPrice[this.pricebg].IsPromotion != 1) {
					sum = this.resData.ServerPrice[this.pricebg].Score
				} else {
					sum = this.resData.ServerPrice[this.pricebg].Promotion
				}
			}

			let _this = this;
			if (_this.resData.AppointmentType == '一起挥') {
				_this.contenttext = '发布一起挥需要' + sum + '挥豆'
			} else if (_this.resData.AppointmentType == '找私教') {
				_this.contenttext = '发布找私教需要' + sum + '挥豆'
			} else {
				_this.contenttext = '发布招学员需要' + sum + '挥豆'
			}

			uni.showModal({
				title: '温馨提示',
				content: _this.contenttext,
				confirmText: "确定",
				success: async function (res) {
					if (res.confirm) {
						if (_this.Score < sum) {
							uni.showModal({
								title: '温馨提示',
								content: '您余额不足，请充值',
								confirmText: "确定",
								success: async function (res) {
									if (res.confirm) {
										_this.nav_to('/pages/user/payHuiDou')
										return
									} else if (res.cancel) {

									}
								}
							});
						} else {
							_this.$pv.load('支付中', 0)
							await _this.$api.post('Payment/ScorePay', {
								EventType: _this.resData.AppointmentType,
								EventID: _this.resData.ID,
								PayScore: sum
							}).then(res => {
								if (res.code == 0) {
									_this.$pv.msg('发布成功');
									_this.$store.commit('changeRefresh', true)
									_this.init();
								} else {
									_this.$pv.msg('发布失败');
								}
							}).finally(() => {
								_this.$pv.closeLoad()
							})
						}
					} else if (res.cancel) {

					}
				}
			});

		},
		//简绍伸缩
		onexpand() {
			this.toggle = !this.toggle;
		},
		//起始地图位置
		startMap() {
			uni.openLocation({
				latitude: this.resData.Start_Lat,
				longitude: this.resData.Start_Lng,
				success: function () {
				}
			});
		},
		endMap() {
			uni.openLocation({
				latitude: this.resData.End_Lat,
				longitude: this.resData.End_Lng,
				success: function () {
				}
			});
		},
		openMap(item) {
			uni.openLocation({
				latitude: this.resData.Latitude,
				longitude: this.resData.Longitude,
				success: function () {

				}
			});
		},
		//同意或拒绝加入组局
		// async auditItem(id, uID, appointmentId, status, index) {
		// 	const res = await this.$api.post('Appointment/AuditItem', {
		// 		ID: id,
		// 		AppointmentID: appointmentId,
		// 		Status: status
		// 	});
		// 	if (!res.data) {
		// 		this.$pv.msg(res.message);
		// 		return;
		// 	}
		// 	uni.$emit('people_confirm', {});

		// 	// 获取用户
		// 	let user_cache = await this.$api.post('/user/GetUserInfo', {
		// 		ID: uID
		// 	});

		// 	const groupID = uni.$prefix + appointmentId.toString();
		// 	const userIDs = uni.$prefix + uID.toString();
		// 	if (status == 1) {
		// 		await this.$im.inviteUsersIntoGroup({ groupID, userIDs });
		// 		const user = uni.getStorageSync('user');
		// 		await this.$im.sendCustomMessage({
		// 			conversationID: groupID,
		// 			subType: 51, //直接加入群聊
		// 			conversationType: 2,
		// 			message: JSON.stringify({
		// 				id: groupID,
		// 				nickName: user_cache.data.Name,
		// 				userID: user_cache.data.UserID,
		// 				operatorNickName: user.Name,
		// 				operatorUserID: user.UserID
		// 			})
		// 		});
		// 	}

		// 	this.$pv.msg('操作成功');
		// },
		async onScrollRefresh() {
			let loc = await this.getLocationSysc();
			let res = await this.$api.post('Appointment/Detail', {
				ID: this.ID,
				User_Lng: loc.longitude,
				User_Lat: loc.latitude
			});
			//找到发起人数据
			this.resData = res.data;
			//报名列表
			this.applyList = res.data.Item
			this.applyNum = this.applyList.length;
			//已确认列表
			this.confirmList = res.data.Item.filter((v) => v.Status == 1 && v.UserID != this.resData.UserID).map((v) => {
				return v;
			});
			this.confirmNum = this.confirmList.length;
		},
		getVipCss(userInfo) {
			if (userInfo.UserType == '年卡会员' || userInfo.UserType == '黑金年卡会员') return 'blackVip';
			if (userInfo.UserType == '金卡会员' || userInfo.UserType == '体验会员') return 'goldVip';
			return '';
		},
		app_share() {
			this.$refs.share.open();
		},
		openFriend() {
			this.$refs.friends.open();
		},
		// async add_user() {
		// 	this.nav_to('/pages/ball/ball_invite_people?id=' + this.resData.ID);
		// },
		// 扫码核销
		async reduce_user() {
			let that = this
			uni.scanCode({
				scanType: ['qrCode'],
				success: async function (res) {
					let res1 = await that.$api.post('/Appointment/Verified', {
						ActionCode: res.result,
						AppointmentID: that.resData.ID
					});
					if (res1.code == 0) {
						that.$refs['checkbox'].open()
					} else {
						that.mesAge = res1.message
						that.$refs['Failcheckbox'].open()
					}
				}
			});
			// this.nav_to('/pages/ball/ball_details_people?id=' + this.ID)
		},
		// 跳转订单详情
		goOrderDetail() {
			this.nav_to(`/pages/together/order_detail?id=${this.ticketNum}`)
		},
		// async toGroup() {
		// 	const name = '【' + this.resData.Title + '】群聊';
		// 	this.nav_to(`/pages/chat/group_game?id=${this.groupID}&type=2&name=${name}`);
		// },
		async agree_invite() {
			const groupID = this.ID.toString();
			let _this = this;
			// const
			uni.showModal({
				title: '温馨提示',
				content: '是否确定加入？',
				confirmText: '确定加入',
				success: function (rs) {
					if (rs.confirm) {
						let d = _this.$api.post('Appointment/InviteComfirm', {
							AppointmentID: _this.ID,
							Status: 1
						});

						// _this.$im.joinGroup(groupID).then((res) => {
						// 	let textMsg = '我是' + _this.user.Name;
						// 	_this.$im.sendChatMessage(2, textMsg, groupID, _this.isByte).then((d) => { });
						// });
						_this.$pv.msg('加入成功');

						_this.init();
					} else if (rs.cancel) {
					}
				}
			});
		},
		async reject_invite() {
			let _this = this;
			uni.showModal({
				title: '温馨提示',
				content: '是否确定拒绝加入？',
				confirmText: '确定拒绝',
				success: function (rs) {
					if (rs.confirm) {
						let d = _this.$api.post('Appointment/InviteComfirm', {
							AppointmentID: _this.ID,
							Status: -1
						});

						_this.$pv.msg('已拒绝加入');

						_this.init();
					} else if (rs.cancel) {
					}
				}
			});
		},
		async user_sign() {
			let d = await this.$api.post('Appointment/UserSign', {
				AppointmentID: this.ID,
				User_Lat: this.latitude,
				User_Lng: this.longitude
			});

			if (!d.data) {
				this.$pv.msg(d.message);
				return;
			}

			this.$pv.msg('签到成功');

			this.init();
		},
		edit() {
			let _this = this;
			uni.showActionSheet({
				itemList: ['编辑组局', '开始组局', '发放奖励', '结束组局', '取消组局'],
				success: function (res) {
					if (res.tapIndex == 0) {
						if (_this.resData.Status > 0) {
							_this.$pv.msg('组局已开始或已结束，不能编辑');
							return;
						}

						_this.nav_to('/pages/ball/ball_edit?id=' + _this.resData.ID);
					} else if (res.tapIndex == 1) {
						//开始球局
						if (_this.resData.Status == 1) {
							_this.$pv.msg('组局已经开始了');
							return;
						}
						uni.showModal({
							title: '温馨提示',
							content: '你确定要开始组局吗？',
							confirmText: '确定开始',
							success: function (rs) {
								if (rs.confirm) {
									let d = _this.$api
										.post('Appointment/StartAppointment', {
											ID: _this.resData.ID
										})
										.then((res) => {
											if (res.code == 0 && res.message == 'success') {
												_this.resData.Status = 1;
											}
										});
								} else if (rs.cancel) {
								}
							}
						});
						return;
					} else if (res.tapIndex == 2) {
						//发放奖励
						if (_this.resData.Status == 0) {
							_this.$pv.msg('组局未开始，不能发放奖励');
							return;
						}
						if (_this.resData.Commission <= 0) {
							_this.$pv.msg('组局未设置奖励，不需要发放');
							return;
						}

						_this.nav_to('/pages/ball/sendreward_user?id=' + _this.ID);
					} else if (res.tapIndex == 3) {
						//结束球局
						const groupID = _this.resData.ID.toString();
						uni.showModal({
							title: '温馨提示',
							content: '确定要结束该组局吗？',
							confirmText: '确定结束',
							success: function (rs) {
								if (rs.confirm) {
									let d = _this.$api
										.post('Appointment/FinishAppointment', {
											ID: _this.resData.ID
										})
										.then((res) => {
											if (res.code == 0 && res.message == 'success') {
												_this.$pv.msg('组局成功结束');
												setTimeout(() => {
													uni.navigateBack();
												}, 1200);
											}
										});
									// 解散球局群聊
									// _this.$im.dismissGroup(groupID)
								} else if (rs.cancel) {
								}
							}
						});
					} else if (res.tapIndex == 4) {
						//取消球局

						if (_this.resData.Status > 0) {
							_this.$pv.msg('组局已开始或已结束，不能取消');
							return;
						}

						uni.showModal({
							title: '温馨提示',
							content: '确定要取消该组局吗？',
							confirmText: '确定取消',
							success: function (rs) {
								if (rs.confirm) {
									let d = _this.$api.post('Appointment/Cancel', {
										ID: _this.resData.ID
									});
									_this.$pv.msg('取消成功');
									setTimeout(() => {
										uni.navigateBack();
									}, 1200);
								} else if (rs.cancel) {
								}
							}
						});
					}
				},
				fail: function (res) { }
			});
		},

		async init() {
			this.user = uni.getStorageSync('user');
			if (uni.getStorageSync('user').UserID) {
				let userres = await this.$api.post('User/GetUserInfo', {
					ID: uni.getStorageSync('user').UserID
				});
				if (userres.code == 0) {
					this.Score = userres.data.AccountInfo.Score
				}
			}
			this.getTicketNum()
			let loc = await this.getLocationSysc();
			this.longitude = loc.longitude;
			this.latitude = loc.latitude;

			let res = await this.$api.post('Appointment/Detail', {
				ID: this.ID,
				User_Lng: loc.longitude,
				User_Lat: loc.latitude
			});
			if (res.code == 100) {
				uni.showModal({
					title: '温馨提示',
					content: '该活动已下架',
					showCancel: false,
					success: function (res) {
						if (res.confirm) {
							uni.navigateBack();
						}
					}
				});
			}
			//找到发起人数据
			if (res.data.Images) {
				this.imglist = res.data.Images.split(',')
			}
			if (res?.data?.Item) {
				this.initUser = res?.data?.Item.find((v) => v.IsMySelf == 1);
			}
			


			this.resData = res.data;
			this.GetBase64ForID()
			this.priceList = this.resData.ServerPrice
			this.topCharactersHTML = this.$util.entitiesToUtf16(this.resData.Remark.replace(/\<img/gi, '<img class="helpImg"'))
			this.userIDList = res.data.Item.map((item) => item.UserID);
			this.is_sign = res.data.Item.some((v) => v.UserID == this.user.UserID);
			this.user_state = res.data.Item.filter((v) => v.UserID == this.user.UserID)
			this.defaultimg = res.data.PeopleNum > 10 ? 10 : res.data.PeopleNum
			this.userList = res.data.Item;

			//判断自己是否被拒绝
			for (let i = 0; i < this.resData.Item.length; i++) {
				if (this.resData.Item[i].Name == this.user.Name) {
					if (this.resData.Item[i].Status == -2) {
						this.ismyrefuse = true;
					}
				}
			}
			//报名列表
			this.applyList = res.data.Item
			this.applyNum = this.applyList.length;
			//已确认列表
			this.confirmList = res.data.Item.filter((v) => v.Status == 1 && v.UserID != this.resData.UserID).map((v) => {
				return v;
			});
			this.confirmNum = this.confirmList.length;
			this.my_ball_status = res.data.Item.filter((v) => v.UserID == this.user.UserID && v.Status != -1 && v.Status != -2)
			this.payPrice = this.resData.Price;

			this.load = true;
			// 分享朋友圈进来的，直接return
			if (this.isShare == 1) {
				return
			}

			let ud = await this.$api.post('Appointment/IsSign', {
				AppointmentID: this.ID
			});
			if (ud.data) this.IsSign = true;
			else this.IsSign = false;

			let sd = await this.$api.post('Appointment/IsSuccessed', {
				AppointmentID: this.ID
			});
			this.IsSuccessed = sd.data;
			this.Success_Msg = sd.message;
		},
		// 获取定位
		async getLocationSysc() {
			let _this = this;
			return new Promise((resolve, reject) => {
				uni.getLocation({
					type: 'gcj02',
					success: function (res) {
						resolve(res);
					},
					fail: function (err) {
						console.log(err, 'err');
						const defaultLocation = {
							latitude: 0,
							longitude: 0
						};
						resolve(defaultLocation);
					}
				});
			});
		},
		switchTab(num) {
			this.currentTab = num;
		},
		async subJoin() {
			let _this = this;
			// if (this.resData.Status == 1) {
			// 	this.$pv.msg('该预约已经开始，无法报名');
			// 	return
			// }
			if (uni.getStorageSync('user').UserID) {
				let u = await this.$api.post('User/GetUserInfo', {
					ID: uni.getStorageSync('user').UserID
				});
				this.user = u.data;
			}
			if (this.user.IsAuth == 0) {
				uni.showModal({
					title: '温馨提示',
					content: '未注册用户不能报名，请先注册！',
					confirmText: '关闭',
					cancelText: '注册账号',
					success: function (res) {
						if (res.confirm) {
							uni.navigateBack({
								delta: 1
							});
						} else if (res.cancel) {
							_this.nav_to('/pages/start/start2');
						}
					}
				});
			} else {
				if (this.user.Phone == '' && this.user.WechatNo == '') {
					uni.showModal({
						title: '温馨提示',
						content: '请完善您的联系方式',
						confirmText: '确定',
						success: function (res) {
							if (res.confirm) {
								_this.nav_to('/pages/user/user_edit');
							} else if (res.cancel) {

							}
						}
					});
				} else {
					this.nav_to(`/pages/ball/ball_join_confirm?id=${this.ID}`);
				}

			}
		},
		async cancelBall() {
			let _this = this;
			if (_this.user_state[0].Status == 0 || _this.resData.AppointmentType != '一起挥') {
				uni.showModal({
					title: '温馨提示',
					content: '您确认要取消报名吗',
					showCancel: true,
					success: async function (res) {
						if (res.confirm) {
							_this.$pv.load();
							let r = await _this.$api.post('Appointment/UserCancel', {
								AppointmentID: _this.ID
							});
							setTimeout(() => {
								_this.$pv.msg('已取消');

								_this.init();
							}, 500);
						}
					}
				});
			} else if (_this.user_state[0].Status == 1) {
				uni.showModal({
					title: '温馨提示',
					content: '您确认要退出活动吗，退出前请先联系发起人',
					showCancel: true,
					success: async function (res) {
						if (res.confirm) {
							uni.makePhoneCall({
								phoneNumber: _this.resData.Phone,
								// phoneNumber: '15572847621',
								success: () => {
								},
								fail: () => {
									console.error('拨打电话失败！');
								},
							});
							// let r = await _this.$api.post('Appointment/UserQuit', {
							// 	AppointmentID: _this.ID
							// });
							// setTimeout(() => {
							// 	_this.$pv.msg('已退出');

							// 	_this.init();
							// }, 500);
						}
					}
				});
			}

			// api/Appointment/UserCancel
		},

		sharePYQ() {
			const user = uni.getStorageSync('user');

			const pid = user.UserID;
			let id = this.ID;

			const BaseUrl = 'http://h5.golf.xiaojusmart.com/#/';
			const paseUrl = `pages/H5/ball_detail?id=${id}&pid=${pid}`;
			let shareUrl = BaseUrl + paseUrl;


			uni.share({
				provider: 'weixin',
				scene: 'WXSceneTimeline',
				type: 0,
				href: shareUrl,
				title: '【挥友' + this.resData.GolfType + '】' + this.resData.Title,
				summary: this.resData.Remark,
				imageUrl: 'https://golfdate.oss-cn-shenzhen.aliyuncs.com/golf_home_bg2.jpg',
				success: (res) => {
					// console.log('success:' + JSON.stringify(res));
					this.$refs.share.close();
				},
				fail(err) {
					console.log('fail:' + JSON.stringify(err));
				}
			});
		},
		shareWX() {
			const user = uni.getStorageSync('user');

			const pid = user.UserID;
			let id = this.ID;

			const BaseUrl = 'http://h5.golf.xiaojusmart.com/#/';
			const paseUrl = `pages/H5/ball_detail?id=${id}&pid=${pid}`;
			let sharUrl = BaseUrl + paseUrl;
			let _this = this;
			uni.share({
				provider: 'weixin',
				scene: 'WXSceneSession',
				type: 5,
				imageUrl: 'https://golfdate.oss-cn-shenzhen.aliyuncs.com/golf_home_bg2.jpg',
				title: '【挥友' + this.resData.GolfType + '】' + this.resData.Title,
				miniProgram: {
					id: 'gh_ff1a33213d99',
					path: 'pages/ball/ball_details?id=' + id + '&pid=' + pid,
					type: 0,
					webUrl: sharUrl
				},
				success: (res) => {
					this.$refs.share.close();
				},
				fail(err) {
					console.log('fail:' + JSON.stringify(err));
				}
			});

			// this.is_app_share_show = false;
		},
		// 获取票号
		async getTicketNum() {
			let res = await this.$api.post('Appointment/MySign', {
				AppointmentID: this.ID
			});
			if (res.code == 0) {
				this.ticketNum = res.data?.ActionCode
			}

		}
	},
	computed: {
		getTime2() {
			return (l) => {
				let d = new Date(l);
				let timestamp = d.getTime();
				return this.$u.date(timestamp, 'mm-dd');
			};
		},
		getdefimg() {
			let num = Number(this.defaultimg) - Number(this.confirmNum)
			return num
		},
		temaBrowserNum() {
			if (this.resData.ClickNum > 9999) {
				return (this.resData.ClickNum / 10000).toFixed(1) + 'W'
			} else {
				return this.resData.ClickNum
			}
		},
	}
};
</script>

<style lang="scss">
button::after {
	border: none;
}
.suobox{
  text-align: center;
  margin-top: 58rpx;
}
.suoimg{
    width: 160rpx;
    height: 160rpx;
}
.suotitle{
  color: #999999;
  font-size: 28rpx;
}
.scroll-Y{
  // position: relative;
  // height: 1150rpx;
//   padding-bottom: 200rpx;
  height: 820rpx;
  .load{
    position: absolute;
    width: 100%;
    height: 100%;
    // background: #292c2e;
    left: 0;
    top: 0;
  }
}
.wrap {
	width: 100%;
	height: 100vh;
	overflow: hidden;
	background-size: cover;
	background-repeat: no-repeat;
}

.overlay {
	width: 100%;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.8);
}

.contentbox {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	padding: 38rpx 32rpx;
	height: 100vh;
	overflow-y: auto;

	.topbox {
		display: flex;
		// align-items: center;
		margin-bottom: 46rpx;

		.logoimg {
			width: 204rpx;
			min-width: 204rpx;
			height: 272rpx;
			border-radius: 16rpx;
			margin-right: 24rpx;
			position: relative;
			display: block;
		}
		.statitle{
			width: 84rpx;
			height: 32rpx;
			background: #706EEE;
			border-radius: 16rpx 0rpx 16rpx 0rpx;
			font-size: 20rpx;
			color: #fff;
			// margin-right: 12rpx;
			// vertical-align: middle;
			display: flex;
			align-items: center;
			justify-content: center;
			position: absolute;
			top: 36rpx;
			left: 32rpx;
		}
		.rightbox {
			display: flex;
			flex-direction: column;
			justify-content: space-between;

			.title {
				font-size: 36rpx;
				font-weight: bold;
				color: #fff;
				margin-bottom: 16rpx;
			}
			.PlaceTypebox{
				display: flex;
				align-items: center;
			}
			.PlaceType {
				width: 76rpx;
				height: 32rpx;
				background: #706EEE;
				border-radius: 4rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 20rpx;
				color: #fff;
				margin-bottom: 30rpx;
				margin-right: 10rpx;
			}

			.price {
				font-size: 32rpx;
				font-weight: bold;
				color: #706EEE;
				margin-bottom: 10rpx;
				margin-top: auto;
			}
			.cklibox{
				display: flex;
				align-items: center;
				justify-content: space-between;
				.StatusTips{
					width: fit-content;
					height: 40rpx;
					padding: 10rpx 20rpx;
					background: #706EEE;
					border-radius: 20rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 20rpx;
					color: #fff;
				}
			}
			.ClickNum {
				width: fit-content;
				height: 40rpx;
				padding: 10rpx 20rpx;
				background: rgba(255, 255, 255, 0.2);
				border-radius: 20rpx;
				font-size: 20rpx;
				color: #fff;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
	}

	.navbox {
		display: flex;
		align-items: center;
		margin-bottom: 46rpx;

		.navtext {
			font-size: 32rpx;
			color: #999999;
			margin-right: 32rpx;
			position: relative;
		}

		.text5 {
			font-size: 32rpx;
			font-weight: bold;
			color: #fff;
		}

		.reportimg {
			width: 40rpx;
			height: 40rpx;
			margin-left: auto;
		}

		.boline {
			width: 40rpx;
			height: 10rpx;
			background: #706EEE;
			border-radius: 5rpx;
			position: absolute;
			bottom: -16rpx;
			left: 50%;
			transform: translateX(-50%);
		}
	}

	.pelbox {
		width: 686rpx;
		height: 356rpx;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 16rpx;
		padding: 18rpx 32rpx;
		display: flex;
		// align-items: center;
		flex-wrap: wrap;
		margin-bottom: 20rpx;

		.hdbox {
			width: 104rpx;
			height: 150rpx;
			// margin-right: 68rpx;
			margin: 0 25rpx;
			margin-bottom: 18rpx;
			position: relative;

			.isComing {
				position: absolute;
				z-index: 10;
				width: 70rpx;
				text-align: center;
				top: 82rpx;
				/* right: 15rpx; */
				left: 50%;
				transform: translateX(-50%);
				background: #706EEE;
				border-radius: 16rpx;
				font-weight: bold;
				font-size: 18rpx;
				color: #FFFFFF;
				padding: 4rpx 12rpx;
			}

			.pelimg {
				width: 104rpx;
				height: 104rpx;
				border: 2rpx solid #fff;
				border-radius: 50%;
			}

			.nametext {
				width: 104rpx;
				font-size: 24rpx;
				font-weight: bold;
				color: #FCFCFC;
				text-align: center;
			}
		}

		.allpel {
			width: 104rpx;
			height: 104rpx;
			background: #706EEE;
			border: 2rpx solid #FFFFFF;
			border-radius: 50%;
			text-align: center;
			padding-top: 16rpx;

			.addtext {
				font-size: 24rpx;
				color: #FCFCFC;
			}
		}
	}

	.system {
		width: fit-content;
		height: 54rpx;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 27rpx;
		display: flex;
		align-items: center;
		padding: 0 16rpx;
		margin-bottom: 20rpx;

		.xing {
			width: 24rpx;
			height: 22rpx;
		}

		.systemtext {
			font-size: 24rpx;
			font-weight: bold;
			color: #69D8FE;
		}
	}

	.hint {
		width: 686rpx;
		height: 88rpx;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 27rpx;
		font-size: 24rpx;
		font-weight: bold;
		color: #FEDB44;
		padding: 10rpx 16rpx;
	}

	.contbox_1 {
		width: 686rpx;
		// height: 212rpx;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 16rpx;
		padding: 32rpx 24rpx;
		margin-bottom: 20rpx;

		.timebox {
			display: flex;
			align-items: center;
			margin-bottom: 44rpx;
			margin-right: 8rpx;

			.timeimg {
				width: 32rpx;
				height: 32rpx;
				margin-right: 8rpx;
			}

			.timetext {
				font-size: 28rpx;
				color: #fff;
			}
		}

		.addrebox {
			display: flex;
			align-items: center;

			.addreimg {
				width: 32rpx;
				height: 32rpx;
				margin-right: 8rpx;
			}

			.addretext {
				font-size: 28rpx;
				color: #fff;
				flex: 1;
			}

			.mapimg {
				width: 56rpx;
				height: 56rpx;
				margin-left: auto;
			}
		}
	}

	.conbox_2 {
		display: flex;
		align-items: center;
		width: 686rpx;
		height: 94rpx;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 16rpx;
		padding: 0 22rpx;
		margin-bottom: 84rpx;

		.noticeimg {
			width: 68rpx;
			height: 36rpx;
			margin-right: 12rpx;
		}

		.noticetext {
			font-size: 28rpx;
			color: #fff;
		}

		.arrow {
			width: 36rpx;
			height: 36rpx;
			margin-left: auto;
		}
	}

	.conbox_3 {
		.title_3 {
			font-size: 32rpx;
			color: #D5D3D2;
			text-align: center;
			margin-bottom: 24rpx;
		}

		.debox {
			width: 686rpx;
			// height: 1154rpx;
			background: rgba(255, 255, 255, 0.2);
			border-radius: 16rpx;
			padding: 32rpx 24rpx;

			.Remark {
				font-size: 28rpx;
				color: #fff;
				margin-bottom: 36rpx;
				white-space: pre-wrap;
			}

			.deimg {
				width: 638rpx;
				margin-bottom: 30rpx;
			}
		}
	}
}

.subscribe {
	width: 100%;
	display: flex;
	align-items: center;
}

.sharetetx {
	font-size: 20rpx;
	color: #fff;
	text-align: center;
}

.shareBtn {
	width: 56rpx;
	height: 76rpx;
	margin-left: 27rpx;

	button {
		display: flex;
		background-color: unset;
		width: 48rpx;
		height: 48rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}
}


.heightadd {
	height: 225rpx !important;
}

.bottombox {
	width: 100%;
	height: 205rpx;
	position: relative;

	.bottom {
		width: 100%;
		// min-height: 132rpx;
		height: 205rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		background-color: rgba(255, 255, 255, 0.2);
		padding: 25rpx;
		box-shadow: 0 0 4rpx #ccc;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		z-index: 99;

		.fullBtn {
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 32rpx;
			font-weight: blod;
			width: 100%;
			height: 92rpx;
			margin: 20rpx auto;
			border-radius: 50rpx;
			margin-right: 15rpx;
		}

		.halfBtn {
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 32rpx;
			font-weight: blod;
			width: 45%;
			height: 92rpx;
			border-radius: 50rpx;
		}

		.btnGroup {
			display: flex;
			justify-content: space-between;
			width: 100%;
			align-items: center;

			.bcolor {
				color: #fff;
			}

			.money {
				.titl1 {
					font-size: 42rpx;
					font-weight: 600;
					color: #706EEE;

					.Promotion {
						font-size: 42rpx;
						font-weight: 600;
						color: #706EEE;
						margin-right: 10rpx;
					}

					.prtitle {
						color: #706EEE;
						font-size: 32rpx;
					}

					.ptitle {
						font-size: 24rpx;
						color: #c1c1c1;
					}

					.Price {
						font-size: 30rpx;
						font-weight: 400;
						color: #c1c1c1;
						text-decoration: line-through;
					}
				}

				.titl2 {
					font-size: 24rpx;
					color: #999999;
				}
			}

			.ebtn {
				width: 272rpx;
				height: 88rpx;
				border-radius: 44rpx;
				color: #fff;
				background-color: #706EEE;
				text-align: center;
				line-height: 88rpx;

				view {
					font-size: 32rpx;
					font-weight: 600;
					color: #fff;
				}
			}
		}
	}
}

.organize {
	border: 1px solid #333333;
	color: #0d0d0d;
	background-color: #fff;
}

.organizeapp {
	border: 1px solid #333333;
	color: #0d0d0d;
	background-color: #fff;
	margin: 0 auto;

}

.whiteBtn {
	color: #999999;
	background: #e6e6e6;
	// border: 1px solid #333333;
}

.kongbtn {
	height: 88rpx !important;
	background-color: transparent;
	border: 2rpx solid #999999;
}

.blackBtn {
	background: linear-gradient(180deg, #9A98FF 0%, #706EEE 100%);
	color: #ffffff;
}

.x-share {
	background-color: #ffffff;
	width: 750rpx;
	border-radius: 20rpx;
	padding: 40rpx 20rpx 80rpx;
	display: flex;
	box-sizing: border-box;

	.item {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;

		image {
			width: 64rpx;
			height: 64rpx;
			margin-bottom: 10rpx;
		}

		span {
			color: #2e2e2e;
		}
	}
}

.noWorkBox {
	width: 100%;
	height: 210rpx;
	opacity: 0;
}

.x-share {
	z-index: 9999;
	background-color: #ffffff;
	width: 750rpx;
	border-radius: 20rpx;
	padding: 40rpx 20rpx 80rpx;
	display: flex;
	box-sizing: border-box;

	.item {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;

		image {
			width: 64rpx;
			height: 64rpx;
			margin-bottom: 10rpx;
		}

		span {
			color: #2e2e2e;
		}
	}
}

.share_tips {
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.6);
	position: relative;
	display: flex;
	justify-content: center;

	.tips_close {
		position: absolute;
		padding: 14rpx 24rpx;
		border-radius: 50rpx;
		border: 4rpx solid #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
		font-size: 30rpx;
		font-weight: bold;
		top: 36%;
		left: 50%;
		transform: translate(-50%, 0);

		image {
			width: 100%;
			height: 100%;
		}
	}
}

.tip {
	padding-bottom: 20rpx;
	background: #fff;
	border-radius: 10rpx 10rpx 0 0;

	.tit {
		line-height: 90rpx;
		text-align: center;
		color: #333;
	}

	.title_popu {
		font-weight: bold;
		color: #333333;
		font-size: 32rpx;
		margin-bottom: 15rpx;
	}

	.txt {
		.c2 {
			color: #666;
		}
	}

	.mb30 {
		margin-bottom: 30rpx;
	}

	.btn3 {
		margin-top: 30rpx;
	}
}

.Successbox {
	width: 544rpx;
	background: #FFFFFF;
	border-radius: 48rpx;
	text-align: center;
	padding: 56rpx;

	.suimg {
		width: 152rpx;
		height: 152rpx;
	}

	.sutext {
		font-size: 36rpx;
		font-weight: bold;
		color: #333333;
		margin-top: 48rpx;
		margin-bottom: 40rpx;
	}

	.sutfiext {
		font-size: 28rpx;
		color: #999999;
		margin-bottom: 56rpx;
	}

	.coutbtn {
		width: 440rpx;
		height: 88rpx;
		background: #706EEE;
		border-radius: 44rpx;
		font-size: 28rpx;
		font-weight: bold;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.suclose {
		font-size: 28rpx;
		color: #999999;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 24rpx;
	}
}
.mesbox{
  width: 100%;
//   height: 820rpx;
  padding: 56rpx 0;
//   overflow-y: auto;
//   background-color: red;
  .mescont{
    width: 100%;
    padding: 0 24rpx;
    .mestime{
      font-size: 24rpx;
      color: #999999;
      text-align: center;
      margin-bottom: 32rpx;
    }
    .other{
      display: flex;
    //   align-items: end;
      margin-bottom: 32rpx;
      .otherhdimg{
        width: 80rpx;
        height: 80rpx;
        border-radius: 50%;
        background-color: #58ABFF;
        margin-right: 24rpx;
      }
      .otinfo{
		.otnamebox{
          display: flex;
          align-items: center;
          margin-bottom: 8rpx;
        }
        .otname{
          font-size: 24rpx;
          color: #999999;
          // margin-bottom: 8rpx;
          margin-left: 10rpx;
        }
        .ottype {
          width: 60rpx;
          height: 32rpx;
          background: #706EEE;
          border-radius: 4rpx;
          display: flex;
          justify-content: center;
          align-items: center;
          font-size: 22rpx;
          color: #fff;
        }
        .otmes{
			width: fit-content;
          	max-width: 446rpx;
		    word-break: break-all;
			white-space: pre-line;
          min-height: 74rpx;
          padding: 20rpx 32rpx;
          background: rgba(255,255,255,0.2);
          border-radius: 0rpx 24rpx 24rpx 24rpx;
          font-size: 28rpx;
          color: #fff;
        }
      }
    }
    .my{
      display: flex;
    //   align-items: end;
      justify-content: flex-end;
      .myhdimg{
        width: 80rpx;
        height: 80rpx;
        border-radius: 50%;
        background-color: #58ABFF;
        margin-left: 24rpx;
      }
      .myinfo{
        .mynamebox{
          display: flex;
          align-items: center;
		justify-content: flex-end;
          margin-bottom: 8rpx;
        }
        .myname{
          font-size: 24rpx;
          color: #999999;
          // margin-bottom: 8rpx;
          margin-right: 10rpx;
          text-align: end;
        }
        .mytype {
          width: 60rpx;
          height: 32rpx;
          background: #706EEE;
          border-radius: 4rpx;
          display: flex;
          justify-content: center;
          align-items: center;
          font-size: 22rpx;
          color: #fff;
        }
		.mycon{
          display: flex;
          align-items: center;
		  justify-content: flex-end;
        }
        .mymes{
			width: fit-content;
          	max-width: 446rpx;
		    white-space: pre-line;
          min-height: 74rpx;
          padding: 20rpx 32rpx;
          background: #706EEE;
          border-radius: 24rpx 0rpx 24rpx 24rpx;
          font-size: 28rpx;
          color: #fff;
			word-break: break-all;
        }
		.mydel{
          width: 32rpx;
          height: 32rpx;
          margin-right: 16rpx;
        }
      }
    }
  }
}
.input-box {
	width: 100vw;
    height: 188rpx;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    box-sizing: border-box;
    padding: 20rpx;
    // border-top: 1px solid rgba(204, 204, 204, .4);
    background-color: rgba(132,132,132,0.4);
    display: flex;
    z-index: 999;
    
    textarea {
        border: 1px solid #EEEEEE;
        background: #EEEEEE;
        padding-left: 20rpx;
        padding-top: 10rpx;
        // padding-bottom: 10rpx;
        flex: 1;
        margin-right: 20rpx;
        color: #848484;
        resize: none; /* 阻止用户调整文本区域的尺寸 */
        overflow-y: hidden; /* 隐藏滚动条 */
        height: 70rpx; /* 初始高度为自动撑开 */
		line-height: 70rpx;
        border-radius: 8rpx;
    }
	.placClass{
        color: #999999;
    }
    .marginBottom{
		color: #333333;
        font-size: 28rpx;
    }
    .view-btn {
        width: 80px;
        text-align: center;
        line-height: 36px;
        height: 64rpx;
        background-color: #706EEE;
        color: #fff;
		margin-top: 8rpx;
		border-radius: 8rpx;
    }

    button {
        background-color: #706EEE;
        font-size: 14px;
    }
}
</style>
